﻿@{
    ViewBag.Title = "考试安排";
    Layout = "~/Views/Shared/_GridCommonLayout.cshtml";
}
<style type="text/css">
    .red {
        color:red;
    }
    .green {
        color:green;
    }
</style>
<link href="~/CSS/bootstrap-datetimepicker.min.css" rel="stylesheet" />
<!--begin grid code-->
<div id="testArrange">
    <section id="widget-grid" class="">
        <div class="row">

            <!--Operation-->
            <div class="heading-buttons">

                <div class="col-xs-12 col-sm-7 col-md-7 col-lg-4">
                    <h1 class="page-title txt-color-blueDark"><i class="fa  fa-legal  fa-fw "></i>
                        考试管理			
                    </h1>
                </div>
                <div class="buttons pull-right">

                    <button type="button" class="btn btn-primary btn-labeled "
                        data-bind="click: $root.onDataDeleting">
                        <span class="btn-label"><i class="glyphicon glyphicon-remove"></i>
                        </span>批量删除</button>
                </div>
                <div style="clear: both;">
                </div>
            </div>
            <!--/Operation-->


            <!--Search-->
            <div class="filter-bar">
                <form id="formSearch">
                    <div class="lbl glyphicons search" style="cursor: pointer;" data-bind="click: $root.search">
                        <i></i>筛选
                    </div>


                    <div>
                        <label>试卷名：</label><div class='input-append'>
                            <input id='txtbSrSTestName' name='txtbSrSTestName' type='text' placeholder='试卷名' class='input-mini' style='width: 120px;' />
                        </div>
                    </div>

                    <div>
                        <label>课程编号：</label><div class='input-append'>
                            <input id='txtbSrSCouseCode' name='txtbSrSCouseCode' type='text' placeholder='课程编号' class='input-mini' style='width: 120px;' />
                        </div>
                    </div>

                    <div>
                        <label>教师编号：</label><div class='input-append'>
                            <input id='txtbSrSTeaCode' name='txtbSrSTeaCode' type='text' placeholder='编号' class='input-mini' style='width: 120px;' />
                        </div>
                    </div>

                    <div>
                        <label>是否审核通过：</label><div class='input-append'>
                            <input id='txtbSrIIsOk' name='txtbSrIIsOk' type='text' placeholder='是否审核通过' class='input-mini' style='width: 120px;' />
                        </div>
                    </div>

                    <div class="clearfix">
                    </div>
                </form>
            </div>
            <!--/search-->


            <article class="col-xs-12 col-sm-12 col-md-12 col-lg-12 sortable-grid ui-sortable">
                <div id="wid-id-0" class="jarviswidget jarviswidget-color-darken jarviswidget-sortable" data-widget-editbutton="false">
                    <header>
                        <span class="widget-icon"><i class="fa fa-table"></i></span>
                        <h2>考试安排</h2>
                    </header>
                    <div style="margin-top: 35px;">
                        <div class="jarviswidget-editbox"></div>
                        <div class="widget-body no-padding">
                            <div role="grid" id="providerGrid" class="dataTables_wrapper form-inline">
                                <div class="table-responsive">

                                    <div class="dt-wrapper" style="overflow-y: auto;">
                                        <table class="table table-striped table-bordered table-hover checkboxs">
                                            <!--table head-->
                                            <thead>
                                                <tr>
                                                    <th style="width: 1%">
                                                        <input type="checkbox" value="0" />
                                                    </th>
                                                    <!-- ko foreach: headers -->
                                                    <th class="center ">
                                                        <a href="#" data-bind="text: displayText@*, click: $root.sort*@" style="color: black"></a>
                                                        <i class="icon-circle-arrow-up" data-bind="    visible: value == $root.orderBy() && $root.isAsc()"></i>
                                                        <i class="icon-circle-arrow-down" data-bind="    visible: value == $root.orderBy() && !$root.isAsc()"></i>
                                                    </th>
                                                    <!-- /ko -->
                                                    <th class="center" style="width: 60px">操作
                                                    </th>
                                                </tr>
                                            </thead>
                                            <!--/table head-->
                                            <!--table body(Provider list)-->
                                            <tbody data-bind="foreach: recordSet">
                                                <tr class="selectable" onclick="">
                                                    <td class="center">
                                                        <input type="checkbox" name="userSelector" data-bind="value: Id" />
                                                        <input type="hidden" data-bind="value: Id, attr: { id: Id }" />
                                                    </td>

                                                    <td class='center'><strong data-bind='text: STestName'></strong></td>
                                                    <td class='center'><strong data-bind='text: SCouseCode'></strong></td>
                                                    <td class='center'><strong data-bind='text: STeaName'></strong></td>
                                                    <td class='center'><strong data-bind='text: STeaCode'></strong></td>
      
                                                    <td class='center'><strong data-bind='text: date(DCreateTime)'></strong></td>
                                                    <td class='center'><strong data-bind='text: IOverTime'></strong></td>
                                                    <td class='center'><strong data-bind='text: ITotal'></strong></td>
                                                    <td class='center'><strong data-bind='text: verifyState(IIsOk),css:$root.color(IIsOk)'></strong></td>
                                                    <td class='center'><strong data-bind='text: IWaitTime'></strong></td>
                                                    <td class='center'><strong data-bind='text: date(DTestTime)'></strong></td>



                                                    <td class="center">
                                                        <a  class="btn-action glyphicons pencil btn-success" data-bind="click: $root.showTestDetail">
                                                            <i></i></a>
                                                    </td>
                                                </tr>
                                            </tbody>
                                            <!--/table body( Provider list)-->
                                        </table>
                                    </div>

                                    <!-- 分页 -->
                                    <ul class="pagination pagination-alt">
                                        <li>
                                            <a data-bind="click: firstPage"><i class="fa fa-fast-backward "></i></a>
                                        </li>
                                        <li>
                                            <a data-bind="click: prevPage"><i class="fa  fa-backward  "></i></a>
                                        </li>
                                        <li>
                                            <a>
                                                <input id="toPage" type="text" data-bind="value: pageIndex, event: { change: $root.changePageIndex }" style="width: 25px;" />
                                                /共<span data-bind="html: totalPages"></span>页 
                                            </a>
                                        </li>
                                        <li>
                                            <a data-bind="click: nextPage"><i class="fa fa-forward "></i></a>
                                        </li>
                                        <li>
                                            <a data-bind="click: lastPage"><i class="fa fa-fast-forward "></i></a>
                                        </li>
                                    </ul>
                                    <div class="dt-top-row total  ">
                                        当前记录共：<span data-bind="html: totalCount"></span>条
                                    </div>
                                    <!--end 分页-->
                                </div>
                                <!-- /分页 -->
                            </div>
                            <!-- /分页 -->
                        </div>
                    </div>
                </div>
            </article>
        </div>
        <!--end row-->
    </section>
</div>


<!--试卷详情-->
<div id="testDetail" hidden style="width: 80%; margin: auto;">

    <div>
        <input type='hidden' id='txtbID' name='txtbID' />
        <form class="smart-form" id="formTestLibPaper">
            <!-- ko with: NodeValue -->
            <span>当前试卷：</span><br />
            <br />
            <label class="label" data-bind="text:STestName" style="font-size: 30px;"></label>
            <hr style="margin: 5px 0px;" />

            <div class="row" style="margin-top: 15px;">
                <section class="col col-4">
                    <label class="label">是否审核通过</label>
                    <label class="select">
                        @{
                            List<SelectListItem> List = new List<SelectListItem>();
                            List.Add(new SelectListItem { Text = "未通过", Value = "0" });
                            List.Add(new SelectListItem { Text = "审核通过", Value = "1" });
                        }
                        @Html.DropDownList("txtbIIsOk", List as IEnumerable<SelectListItem>, new { @data_bind = "value:IIsOk" })
                    </label>
                </section>

                <section class="col col-4">
                    <div class="form-group">
                        <label for="dtp_input1" class="label">考前准备时间(分钟)</label>
                        <label class="input">
                            <input type='text' id='txtbIWaitTime' name='txtbIWaitTime' placeholder='' class='span10' data-bind='value:IWaitTime' />
                        </label>
                    </div>
                </section>

                <section class="col col-4">
                    <div class="form-group">
                        <label for="dtp_input1" class="label">考试持续时间</label>
                        <label class="input">
                            <input type='text' id='txtbIOverTime' name='txtbIOverTime' placeholder='' class='span10' data-bind='value:IOverTime' readonly />
                        </label>
                    </div>
                </section>

            </div>


            <!-- /ko -->
            <section>
                <div class="form-group">
                    <label for="dtp_input1" class="label">考试开始时间</label>
                    <input id="testTime" size="30" type="text" value="" readonly class="form_datetime">
                </div>
            </section>
            <hr />

            <section style="margin-top: 15px;">
                <div class="form-group">
                    <label class="label">选择考试班级:</label>
                </div>
                <div class="inline-group" style="width: 100%;" data-bind="foreach:setClass" id="setClass">
                    <label class="checkbox">
                        <input type='checkbox' name='checkbox' data-bind="value:SClassCode" />
                        <i></i>
                        <p data-bind="text:SClassName"></p>
                    </label>
                </div>
            </section>
        </form>
        <button class="btn" data-bind="click: $root.GetStudent">确定班级,选取学生</button>
        <hr />
    </div>


    <article class="col-xs-12 col-sm-12 col-md-12 col-lg-12 sortable-grid ui-sortable" id="selectStu" hidden>
        <div class="jarviswidget jarviswidget-color-darken jarviswidget-sortable" data-widget-editbutton="false">
            <header style="background-color: #D4D4D4; border: none;">
                <span class="widget-icon"><i class="fa fa-table"></i></span>
                <h2 style="color: black; font-size: 16px;">选择学生  |
                    <input style="margin-right: 5px;" type='checkbox' id="selStuAll" />全选</h2>
            </header>
            <div class="table-responsive" style="margin-top: 30px;">
                <table class="table table-bordered" style="margin-bottom: 10px;">
                    <tbody id="setStudent">
                    </tbody>
                </table>
            </div>
        </div>
    </article>
    <div>
        <button class="btn" data-bind="click:$root.cancel">
            取消</button>
        <button id="btnSaveOrUpdateModel" class="btn btn-primary" data-bind=" click: onDataAddingOrUpdate">
            确定</button>
    </div>
</div>
<!--试卷详情-->



<script src="~/Js/bootstrap/bootstrap-datetimepicker.min.js"></script>
<script type="text/javascript">

    //审核状态显示
    function verifyState(data) {
        if (data == 0)
            return "未通过";
        else
            return "审核通过";
    }

    //规范时间显示格式
    function date(date) {
        if (date == "" || date == null)
            return "";
        var dd = date.slice(0, 10);
        var ss = date.slice(11, 19);
        return dd + " " + ss;
    }

    var gdViewModel;
    $(function () {
        $._messengerDefaults = {
            extraClasses: 'messenger-fixed messenger-theme-future messenger-on-bottom messenger-on-right'
        }; //默认提示位置;


        var options = {

            dialogId: "TestLibPaperMessageModal", //添加对话框

            pageSize: 20, //分页大小
            hidId: $("#txtbID"),
            SaveUpdateBtn: $("#btnSaveOrUpdateModel"),
            frmElement: $("#formTestLibPaper"),

            //节点数据
            NodeValue: ko.observable({

                Id: 0,
                STestName: '',
                ICourseId: 0,
                SCouseCode: '',
                ITeaId: 0,
                STeaCode: '',
                ITermId: 0,
                DCreateTime: new Date(),
                SIp: '',
                IOverTime: 0,
                ITestType: 0,
                ITotal: 0,
                IIsOk: 0,
                DTestTime: new Date(),
                IDiff: 0,
                IHardlevel: 0,
                IKsType: 0,
                STeaName: '',
                IWaitTime: 0,

            }),


            //用户列表Grid头部列名称
            headers: [


 { displayText: '试卷名', value: 'STestName', width: 'auto' },
 { displayText: '课程编号', value: 'SCouseCode', width: 'auto' },
 { displayText: '发布教师姓名', value: 'STeaName', width: 'auto' },
 { displayText: '教师编号', value: 'STeaCode', width: 'auto' },

 { displayText: '组卷时间', value: 'DCreateTime', width: 'auto' },
 { displayText: '完成时间', value: 'IOverTime', width: 'auto' },
 { displayText: '总分', value: 'ITotal', width: 'auto' },
 { displayText: '审核通过状态', value: 'IIsOk', width: 'auto' },
 { displayText: '考前准备时间(分钟)', value: 'IWaitTime', width: 'auto' },
 { displayText: '考试时间', value: 'DTestTime', width: 'auto' },
            ],

            //默认的排序方式
            defaultOrderBy: "Id",
            //用户查询URL
            dataQueryUrlAccessor: function () {
                return "/api/TestLibPaper/GetByPage";
            },

            //添加用户URL
            dataAddUrlAccessor: function () { return ""; },

            //更新操作
            dataUpdateAccessor: function (key) {
                gdViewModel.NodeValue().DTestTime = $("#testTime").val();
                //取得选中学生
                var checked = $("#setStudent input:checked");
                var stuStr = "";
                if (checked == "")
                    return false;
                checked.each(function (i) {
                    stuStr = stuStr + "," + $(this).val();
                });//拼装学生信息字符串
                stuStr = dropRsplit(stuStr, ",");
                return appendQueryString("/api/Exam/Put/" + key, { stuIds: stuStr });
            },


            dataNodeSelect: function (id) {
                return "/api/TestLibPaper/get/" + id;
            },

            dataDeleteAccessor: function (data) {
                var userIDs = "";
                var check = $("input[name='userSelector']:checked");  //得到所有被选中的checkbox
                check.each(function (i) {        //循环拼装被选中项的值
                    userIDs = userIDs + ',' + $(this).val();
                });
                //清除多余的分割号
                userIDs = dropRsplit(userIDs, ",");
                if (userIDs != "") {
                    return appendQueryString("/api/Exam/DeleteIds", { ids: userIDs });
                } else
                    return "";

            }
			, initEd: function () {
			    //gird初始化的后置事件 信息

			}
            , AddBefore: function () {

                return true;
            }
            , showDetailEnd: function (data) {
                var time = date(data.DTestTime);
                $("#testTime").val(time);
            }
            , changeEnd: function () {
                //关闭对话框的后置事件
                $("#testArrange").show();
                $("#testDetail").hide();
            }

        };

        gdViewModel = new gridViewModel(options);

        gdViewModel.setClass = ko.observableArray();//班级数据       

        //取消按钮
        gdViewModel.cancel = function () {
            $("#testArrange").show();
            $("#testDetail").hide();
        }

        //合并学生ID和学生学号
        gdViewModel.StuCodeAndId = function (IStuId, SStuCode) {

            return IStuId + ':' + SStuCode;
        }

        //根据选择的班级获取学生
        gdViewModel.GetStudent = function () {
            var checked = $("#setClass input:checked");
            var classStr = "";
            if (checked == "") {
                $("#selectStu").hide();
                return false;
            }
            checked.each(function (i) {
                classStr = classStr + "," + $(this).val();
            });//拼装班级字符串
            classStr = dropRsplit(classStr, ",");
            $("#selectStu").show();
            $.ajax({
                url: "/api/Exam/GetStudent",
                type: "POST",
                dataType: "JSON",
                data: { classStr: classStr }
            }).done(function (data) {
                $("#setStudent").empty();
                var studentInfor = "";
                var idAndCode = "";
                var tag = "";
                for (var i in data) {
                    //学生信息组装
                    idAndCode = data[i].Id + ":" + data[i].SNo;
                    tag = "<td><div class='checkbox'><label>"
                        + "<input class='checkbox' type='checkbox' value='" + idAndCode + "' name='Stucheckbox'>"
                        + "<span>" + data[i].SNo + " " + data[i].SName + "</span>"
                        + "</label></div>"
                        + "</td>";
                    if (i % 6 == 0)
                        studentInfor = studentInfor + "<tr>";
                    studentInfor = studentInfor + tag;
                    if (i % 6 == 5)
                        studentInfor = studentInfor + "</tr>";
                }
                if (data.length % 10 != 9)
                    studentInfor = studentInfor + "</tr>";
                $("#setStudent").append(studentInfor);
            })
        }


        gdViewModel.init();
        ko.applyBindings(gdViewModel);

        gdViewModel.color = function (data) {
            if (data == 1)
                return 'green';
            else
                return 'red';
        }

        //操作按钮
        gdViewModel.showTestDetail = function (currUser) {
            $("#testArrange").hide();
            $("#testDetail").show();
            var key = currUser.Id;
            gdViewModel.hidId.val(key);//修改                      
            gdViewModel.showDetail(key);//显示信息

            //获取班级信息
            $.ajax({
                url: "/api/Exam/GetClass",
                type: "POST",
                dataType: "JSON",
                data: { TeaCode: currUser.STeaCode, CourseId: currUser.ICourseId, TermId: currUser.ITermId }
            }).done(function (data) {
                gdViewModel.setClass(data);
            });
        }


        options.frmElement.validate({
            rules: {
                txtbIWaitTime: { digits: true },
            },
            messages: {
                txtbIWaitTime: { digits: '必须是整数' },
            }
        });

        //时间控件
        $(".form_datetime").datetimepicker({ format: 'yyyy/mm/dd hh:ii' });

        //全选
        $("#selStuAll").click(function () {
            var x = $("#selStuAll").prop("checked");
            if (x == true) {
                $("input[name='Stucheckbox']").each(function () {
                    $(this).prop("checked", true);
                });
            }
            else {
                $("input[name='Stucheckbox']").each(function () {
                    $(this).prop("checked", false);
                });
            }
        });

    });

    //去除多余的分割符，例如：",a",结果为"a"
    function dropRsplit(a, splitC) {
        var tmpA = a.split(splitC);
        var tmpObj = new Array();
        for (var i = 0; i < tmpA.length; i++) {
            if (tmpA[i] != "") {
                tmpObj.push(tmpA[i]);
            }

        }
        return tmpObj.join(splitC);
    }
</script>

<!--/end grid code-->

